<!-- 发送通知页面 -->
<template>
    <div class="app-container">
        <el-row :gutter="10" class="mb8">
            <el-col :span="1.5">
                <el-button type="primary" plain size="mini" v-show="this.$route.query.status == 6||this.$route.query.status==8" :disabled="single"
                    @click="handleUpdate">发送通知</el-button>
            </el-col>
            <right-toolbar @queryTable="getList"></right-toolbar>
        </el-row>
        <el-table v-loading="loading" :data="candidateList" @selection-change="handleSelectionChange"
            :default-sort="{ prop: 'bidder', order: 'ascending' }">
            <el-table-column type="selection" width="55" align="center" :selectable="selectable" />
            <el-table-column label="序号" type="index" align="center" />
            <el-table-column label="供应商名称" align="center" prop="hName" />
            <el-table-column label="最终报价(万元)" align="center" prop="finalOffer">
                <template slot-scope="scope">
                    {{ scope.row.finalOffer / 10000 }}
                </template>
            </el-table-column>
            <el-table-column label="最终得分" align="center" prop="finalScore" />
            <el-table-column label="是否推荐" align="center" prop="recommend">
                <template slot-scope="scope">
                    <span>{{ scope.row.recommend == 0 ? '是' : '否' }}</span>
                </template>
            </el-table-column>
            <el-table-column label="排名" align="center" prop="ranking" />
            <el-table-column label="是否中标" align="center" prop="bidder" sortable>
                <template slot-scope="scope">
                    <span>{{ scope.row.bidder == 0 ? '是' : '否' }}</span>
                </template>
            </el-table-column>
        </el-table>

        <!-- 添加招标公告对话框 -->
        <el-dialog title="发送通知" :visible.sync="open" width="1080px" append-to-body>
            <el-form ref="form" :model="form" :rules="rules" label-width="120px">
                <el-form-item label="招标项目编号" prop="iNumber">
                    <el-input v-model="form.iNumber" disabled />
                </el-form-item>
                <el-form-item label="供应商ID" prop="hid" class="form-input">
                    <el-input v-model="form.hid" disabled />
                </el-form-item>
                <el-form-item label="供应商名称" prop="uProject" class="form-input">
                    <el-input v-model="form.hName" disabled />
                </el-form-item>
                <el-form-item label="公告标题" prop="resultTitle" class="form-input">
                    <el-input v-model="form.resultTitle" placeholder="请输入公告标题" />
                </el-form-item>
                <el-form-item label="内容" prop="resultDesc">
                    <editor v-model="form.resultDesc" :min-height="192" />
                </el-form-item>
            </el-form>
            <div slot="footer" class="dialog-footer">
                <el-button type="primary" @click="submitForm">确 定</el-button>
                <el-button @click="cancel">取 消</el-button>
            </div>
        </el-dialog>

        <el-row :gutter="10" class="mb8">
            <el-col :span="1.5">
                <div class="box">已发送</div>
            </el-col>
            <right-toolbar @queryTable="getResultList(queryParams.sid)"></right-toolbar>
        </el-row>

        <el-table v-loading="loading" :data="resultList">
            <el-table-column label="序号" type="index" align="center" />
            <el-table-column label="供应商" align="center">
                <template slot-scope="scope">
                    <span>{{ scope.row.hName }}</span>
                </template>
            </el-table-column>
            <el-table-column label="联系人" align="center">
                <template slot-scope="scope">
                    <span>{{ scope.row.ywName }}</span>
                </template>
            </el-table-column>
            <el-table-column label="联系方式" align="center">
                <template slot-scope="scope">
                    <span>{{ scope.row.ywPhone }}</span>
                </template>
            </el-table-column>
            <el-table-column label="邮箱" align="center">
                <template slot-scope="scope">
                    <span>{{ scope.row.ywMailBox }}</span>
                </template>
            </el-table-column>
            <el-table-column label="发送时间" align="center" prop="zBidder">
                <template slot-scope="scope">
                    <span>{{ scope.row.gsResDate }}</span>
                </template>
            </el-table-column>
        </el-table>
    </div>
</template>

<script>
import { getBidWinningCandidateAndSended, setNoticeToSupplier } from "@/api/system/purchase.js";

export default {
    data() {
        return {
            candidateList: [],
            iNumber: '',
            single: true,
            loading: true,
            open: false,
            form: {},
            csTender: {},//判断时间是否合理
            selectRow: [],
            resultList: [],
            currentIndex: 0, // 当前显示的数据索引
            rules: {
                resultTitle: [
                    { required: true, message: "公告标题不能为空", trigger: "blur" }
                ]
            },
        }
    },
    methods: {
        //发送通知
        handleUpdate() {
            if (this.selectRow.length < 1) {
                this.$message({
                    type: 'warning',
                    message: '请选择供应商!'
                });
                return;
            }
            this.open = true;
            this.form.iNumber = this.iNumber;
            this.loadCurrentRow(); // 加载当前索引的数据
        },
        getList() {
            getBidWinningCandidateAndSended(this.iNumber).then(res => {
                this.loading = false;
                res.data.bidWinningCandidateList.forEach(item => {
                    item.iNumber = this.iNumber
                })
                this.candidateList = res.data.bidWinningCandidateList;
                this.resultList = [];
                this.resultList = res.data.results;
                this.csTender = res.data.csTender;
            })
        },
        selectable(row, index) {
            return !this.resultList.some(item => item.hName == row.hName);
        },
        //提交内容
        submitForm() {
            const start = new Date(this.csTender.pStartTime);
            const end = new Date(this.csTender.pEndTime);
            const date = new Date();
            if (date < start || (date > start && date < end)) {
                this.$message({
                    type: 'warning',
                    message: '公示期未过!'
                })
                return false;
            }
            // 提交表单数据
            let sz = [
                this.form
            ]
            this.$refs.form.validate(valid => {
                if (valid) {
                    setNoticeToSupplier(sz).then(res => {
                        if (res.data != null) {
                            this.$message({
                                type: 'success',
                                message: '发送成功!!'
                            });
                            this.getList();
                            this.selectRow = [];
                            this.open = false;
                        }
                    })
                } else {
                    this.$message({
                        type: 'warning',
                        message: '请填写完整!'
                    });
                    return false;
                }
            });
            // 递增索引
            this.currentIndex++;
            // 如果索引超出范围，重置为0
            if (this.currentIndex >= this.selectRow.length) {
                this.currentIndex = 0;
            }
            // 重置表单
            this.resetForm();
            // 加载下一条数据
            this.loadCurrentRow();
        },

        resetForm() {
            this.form.hid = '';
            this.form.hName = '';
        },

        loadCurrentRow() {
            const currentRow = this.selectRow[this.currentIndex];
            if (currentRow) {
                this.form.hid = currentRow.hId;
                this.form.hName = currentRow.hName;
            }
        },
        cancel() {
        },
        handleSelectionChange(selection) {
            this.selectRow = selection;
            this.single = selection.length !== 1
            this.multiple = !selection.length
        },
    },
    mounted() {
        this.iNumber = this.$route.query.iNumber
        this.getList();
    },

}
</script>
<style scoped>
.box {
    margin: 10px 0 0 0;
    color: #409eff;
    font-size: 16px;
    font-weight: bold;
}
</style>